<template>
  <Table :columns="columns" :data="data" border :height="340" :loading="loading" @on-sort-change="onSortChange"></Table>
</template>

<script>
import {Api} from "@/api";

export default {
  name: "problemCompletionRate",
  props: {
    dataToQuery: {
      type: Object,
      default: {},
    },
    accountType: {
      type: String,
    }
  },
  data() {
    return {
      loading: false,
      columns: [
        {
          title: "序号",
          minWidth: 60,
          align: "center",
          render: (h, params) => {
            return h('span', params.index + 1);
          }
        },
        {
          minWidth: 180,
          title: '企业名称',
          key: 'companyName',
          align: 'center',
          tooltip: true
        },
        {
          minWidth: 100,
          title: '发现问题',
          key: 'totalCount',
          sortable: 'custom',
          align: 'center',
        },
        {
          minWidth: 80,
          title: '完成整改',
          key: 'openCount',
          align: 'center',
        },
        {
          minWidth: 80,
          title: '完成率',
          key: 'completionRate',
          align: 'center',
          render: (h, params) => {
            return h('span', params.row.completionRate + "%");
          }
        },
      ],
      data: [],
      queryUrl: Api.problemCompletionRate
    }
  },
  mounted() {
    this.query();
  },
  methods: {
    onSortChange({column, key, order}) {
      this.dataToQuery.order = order;
      if (this.dataToQuery.order == 'normal') {
        this.dataToQuery.order = 'desc';
      }
      this.query();
    },
    query() {
      if (!this.dataToQuery.order) {
        this.dataToQuery.order = 'desc';
      }
      this.loading = true;
      this.$http.post(this.queryUrl + this.accountType, this.dataToQuery).then(res => {
        if (res.data.status === 201) {
          this.$Message.error(res.data.msg);
        }
        if (res.data.status === 200) {
          this.data = res.data.data
        }
        this.loading = false;
      }).catch(e => {
        this.loading = false;
        console.log(e)
        this.$Message.error("查询失败")
      });
    },
  },
}
</script>

<style scoped>

</style>
